<template>
  <div>
    <!-- -->
    <van-nav-bar
      fixed
      :title="navBarTitle"
      @click-left="onClickLeft"
      @click-right="onClickRight"
    >
      <template #left>
        <van-icon name="arrow-left" />
      </template>

      <template #right>
        <van-icon name="ellipsis" />
      </template>
    </van-nav-bar>

    <div>1</div>
    <div>2</div>

    <van-popup
      v-model="showRightPopup"
      position="right"
      :style="{ height: '100%', width: '100%' }"
    >
      <HeaderRight
        :viewType2="viewType"
        :editable.sync="editable"
        :defaultValue="defaultSearchValue"
        :searchValue.sync="searchValue"
        :viewInfo="viewInfo"
        @cancel="showRightPopup = false"
        @on-event="handleToolbarEvent"
      />
    </van-popup>

    <template v-if="actionInfo.type === 'ir.actions.act_window'">
      <div>
        <template v-if="viewType === 'list'">
          <TreeView ref="listView" :viewInfo="viewInfo" />

          <!-- <TreeView
            ref="listView"
            :searchValue="searchValue"
            :viewInfo="viewInfo"
            @on-row-select="handleOnRowSelect"
          /> -->
        </template>

        <template v-else-if="viewType === 'kanban'">
          kanban

          <!-- <KanbanView
            ref="kanbanView"
            :searchValue="searchValue"
            :viewInfo="viewInfo"
          /> -->
        </template>

        <template v-else-if="viewType === 'form'">
          <FormView
            ref="formView"
            :navBarTitle.sync="navBarTitle"
            :editable.sync="editable"
            :viewInfo="viewInfo"
          />

          <!-- <FormView
            ref="formView"
            :editable.sync="editable"
            :viewInfo="viewInfo"
          /> -->
        </template>

        <template v-else> todo:{{ viewType }}</template>
      </div>
    </template>

    <template v-else> no windows </template>
  </div>
</template>

<script>
import webMixin from '@/mixins/webMixin'

import HeaderRight from './HeaderRight.vue'

import TreeView from '@/components/OView/TreeView.vue'
import FormView from '@/components/OView/FormView.vue'

export default {
  name: 'WebView',
  components: { HeaderRight, TreeView, FormView },
  mixins: [webMixin],

  data() {
    return {
      showRightPopup: false
    }
  },

  computed: {},

  watch: {
    // 菜单切换时, 触发
    '$route.fullPath': {
      handler: function (/*val*/) {
        // console.log('in watch, $route.fullPath')
        // console.log('watch fullPath')
        this.init()
      },
      deep: true
    }
  },

  async created() {
    this.init()
  },

  mounted() {},

  methods: {
    onClickLeft() {
      // Toast('返回')
      this.$router.go(-1)
    },

    onClickRight() {
      console.log('onClickRight')

      this.showRightPopup = true
    }

    // onClickBreadcrumb(route) {
    //   //   console.log('onClickBreadcrumb', route)
    //   const { path, query } = route
    //   this.$router.push({ path, query })
    // }
  }
}
</script>

<style type="text/css"></style>
